import HomeView from '../views/Home'
import HomeDefaultView from "../views/Home/Content"
import SassView from "../views/Sass/index"

import AdminListView from "../views/Admin/AdminList"
import AdminAddView from "../views/Admin/AdminAdd"

import ProductListView from '../views/Product/ProductList';
import ProductSearchView from '../views/Product/ProductSearch';

import BannerAddView from '../views/Banner/BannerAdd';
import BannerListView from '../views/Banner/BannerList';
import BannerShowView from '../views/Banner/BannerShow';

import LoginView from '../views/Login'
import NotFoundView from '../views/NotFound'

// 路由配置
const routes = [
    // 一级视图
    {
        path: '/',
        name: 'root',
        component: HomeView,
        beforeEnter: (to, from, next) => {
            console.log("路由独享守卫");
            console.log("进入主页面from",from);
            console.log("进入主页面to",to);
            next();
        },


        // 二级视图
        // label和icon,parent 在路由配置中没有实际意义,但是可以帮助我们生成侧边栏菜单
        // label  侧边栏菜单的名称
        // icon   侧边栏菜单对应的图标
        // parent  二级菜单对应的的一级菜单的信息  

        // 注意: 一级菜单没有parent 二级菜单才有
        children: [{
            path: "",
            redirect: "/home",
        }, {
            path: "/home",
            name: "home",
            label:"首页",
            icon:"el-icon-s-home",
            component: HomeDefaultView
        }, {
            path: "/sass",
            name: "sass",
            label:"Sass",
            icon:"el-icon-s-home",
            component: SassView
        }, {
            path: "/admin/list",
            name: "admin-list",
            label:"管理员列表",
            icon:"el-icon-notebook-2",
            parent:{ path:"/admin",name:"admin",label:"人员管理",icon:"el-icon-folder"}, // 此处不是实际路由配置,只是一个自定义数据
            component: AdminListView
        },{
            path: "/admin/add",
            name: "admin-add",
            label:"管理员新增",
            icon:"el-icon-notebook-2",
            parent:{ path:"/admin",name:"admin",label:"人员管理",icon:"el-icon-folder"}, // 此处不是实际路由配置,只是一个自定义数据
            component: AdminAddView
        },{
            path: "/pro/list",
            name: "pro-list",
            label:"商品列表",
            icon:"el-icon-notebook-2",
            parent:{ path:"/pro",name:"pro",label:"商品管理",icon:"el-icon-folder"}, // 此处不是实际路由配置,只是一个自定义数据
            component: ProductListView
        }, {
            path: "/pro/search",
            name: "pro-search",
            label:"商品搜索",
            icon:"el-icon-search",
            parent:{ path:"/pro",name:"pro",label:"商品管理",icon:"el-icon-folder"}, // 此处不是实际路由配置,只是一个自定义数据
            component: ProductSearchView
        }, {
            path: "/banner/list",
            name: "banner-list",
            label:"轮播列表",
            icon:"el-icon-notebook-2",
            parent:{ path:"/banner",name:"banner",label:"轮播图管理",icon:"el-icon-folder"}, // 此处不是实际路由配置,只是一个自定义数据
            component: BannerListView
        }, {
            path: "/banner/show",
            name: "banner-show",
            label:"轮播展示",
            icon:"el-icon-notebook-2",
            parent:{ path:"/banner",name:"banner",label:"轮播图管理",icon:"el-icon-folder"}, // 此处不是实际路由配置,只是一个自定义数据
            component: BannerShowView
        }, {
            path: "/banner/add",
            name: "banner-add",
            label:"轮播新增",
            icon:"el-icon-notebook-2",
            parent:{ path:"/banner",name:"banner",label:"轮播图管理",icon:"el-icon-folder"}, // 此处不是实际路由配置,只是一个自定义数据
            component: BannerAddView
        },{
            path: "/plugins/echarts",
            name: "plugins-echarts",
            label:"Echarts",
            icon:"el-icon-notebook-2",
            parent:{ path:"/plugins",name:"plugins",label:"插件学习",icon:"el-icon-folder"}, // 此处不是实际路由配置,只是一个自定义数据
            component: ()=>import("@/views/Plugins/Eachars")
        },{
            path: "/plugins/editor",
            name: "plugins-editor",
            label:"Editor",
            icon:"el-icon-notebook-2",
            parent:{ path:"/plugins",name:"plugins",label:"插件学习",icon:"el-icon-folder"}, // 此处不是实际路由配置,只是一个自定义数据
            component: ()=>import("@/views/Plugins/Editor")
        },{
            path: "/modules/a",
            name: "modules-a",
            label:"模块A",
            icon:"el-icon-notebook-2",
            parent:{ path:"/modules",name:"modules",label:"vuex模块",icon:"el-icon-folder"}, // 此处不是实际路由配置,只是一个自定义数据
            component: ()=>import("@/views/Module/MdA")
        },{
            path: "/modules/b",
            name: "modules-b",
            label:"模块B",
            icon:"el-icon-notebook-2",
            parent:{ path:"/modules",name:"modules",label:"vuex模块",icon:"el-icon-folder"}, // 此处不是实际路由配置,只是一个自定义数据
            component: ()=>import("@/views/Module/MdB")
        }]
    },
    {
        path: '/login',
        name: 'login',
        component: LoginView
    },
    {
        path: '/404',
        name: 'not-found',
        component: NotFoundView
    },
    {
        path: '*',
        redirect: "/404",
    }
]


// 对应路由配置 => 生成首页的菜单 

let transformRoutesToMenus = (routes) => {
    let route = routes[0]; // 只将主页中的路由生成菜单
    let children = route.children; // 找到 / 路由下子路由(二级视图)

    let menusMap = {  // 对象数据 => 对应 一级菜单名(name) 存储菜单配置
        // 一级菜单-> 没有parent -> 直接存
        // home:{path:"/home",name:'home',label:"首页",icon:"xxx"}, 


        // 二级菜单-> 1. 如果没有对应的一级菜单(之前没有放过), 先存一级,将对应的二级放到children属性中  
        //           2. 如果有对应的一级菜单(之前已经放过), 直接将对应的二级存到children
        // pro:{path:"/pro",name:'pro',label:"商品管理",icon:"xxx",children:[{},{},{}]}, 
    }

    children.forEach(item=>{ // 二级视图中每一项
        if(item.path=="")  return false;  // 默认跳转  不需要生成菜单
        if(!item.parent){ // 如果item中没有parent => 一级菜单
            let {path,name,label,icon} = item;
            menusMap[name] = {path,name,label,icon};
        }else{  // 有parent => 二级菜单
            let parent = item.parent;  // 获取二级菜单中对应的一级
            let {path,name,label,icon} = item;

            if(menusMap[parent.name]){ // 二级菜单中 对应的一级菜单已经存储
                menusMap[parent.name].children.push({path,name,label,icon})
            }else{ // 二级菜单中 对应的一级菜单没有存储
                menusMap[parent.name] = parent; // 存储对应的一级菜单 => menusMap
                menusMap[parent.name].children = [{path,name,label,icon}] // 将对应的二级放到children属性中
            }
        }

    })
    // console.log("menusMap",menusMap);
    return Object.values(menusMap);
}

// 所有权限菜单
export let menus = transformRoutesToMenus(routes);
// console.log("menus",menus);






export default routes;